<template>
  <div>
    <div class="mian">
      <el-table
      v-loading="loading"
      :data="dataList"
      :header-cell-style="{
        color:'#000',background:'#f6fdfd',height:'44px'
      }"
      :row-style="{
        height:'50px'
      }"
    >
      <el-table-column label="序号" type="index" width="244"></el-table-column>
      <el-table-column label="招投标标题" prop="bidTitle" width="530">
        <template slot-scope="scope">
          <span @click="goDetail(scope.row.id)">{{ scope.row.bidTitle }}</span>
        </template>
      </el-table-column>
      <el-table-column label="发布时间" prop="bidPublishDatetime">
        <template slot-scope="scope">
          {{ parseTime(scope.row.bidPublishDatetime,'{y}-{m}-{d}') }}
        </template>
      </el-table-column>
      <el-table-column label="状态" prop="status">
        <template>
          未报名
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button type="text" size="mini" @click="openDialog(scope.row.id)" style="color: #1dd0b7;">报名</el-button>
        </template>
      </el-table-column>
    </el-table>
    <Pagination
      v-if="total > 0"
      :total = "total"
      :page.sync = "queryParams.pageNum"
      :limit.sync = "queryParams.pageSize"
      @pagination = "getData"
    />
    </div>
    <el-dialog title="报名" :visible.sync="dialogShow" width="300px">
      <span>您确定要报名该投标吗？</span>
      <div slot="footer">
        <el-button @click="cancel">取消</el-button>
        <el-button @click="submmit" type="primary">确定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {listBidding,addBidding} from '@/api/bid/enterprise'
import { mapGetters } from 'vuex'
export default {
  name: "bidding",
  data() {
    return {
      loading:true,
      dataList:[],
      queryParams:{
        pageNum:1,
        pageSize:20,
      },
      total:0,

      dialogShow:false,
      checkBidId:null,
    }
  },
  created() {
    this.getData()
  },
  methods: {
   getData(){
    this.queryParams.category = "2"
    this.queryParams.enterpriseId = this.userId
    listBidding(this.queryParams).then(res=>{
      this.dataList = res.rows
      this.total = res.total
      this.loading = false
    })
   },
   openDialog(bidId){
    this.checkBidId = bidId
    this.dialogShow = true
   },
   cancel(){
    this.dialogShow = false
   },
   submmit(){
    this.cancel()
    addBidding({
      enterpriseId:this.userId,
      bidId:this.checkBidId,
      status:0
    }).then(res=>{
      this.$alert('报名成功', '提示', {
        confirmButtonText: '确定',
        type:"success"
      });
      this.getData();
    })
   },
   goDetail(bidId){
    this.$router.push('/bid/detail?id='+bidId)
   }
  },
  computed:{
   ...mapGetters(['userId'])
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-pagination{
  position: relative;
  display: flex;
  justify-content: center;
}

::v-deep .el-pager .active{
  color: #1dd0b7;
}
</style>
